<!-- 用途：用于支持字符串和数字类型的输入，同时进行数据转换 -->
<script setup>
import { onMounted, ref } from 'vue';

const props = defineProps({
    data: {
        type: null
    },
    inputWidth: {
        type: String,
        default: '100%'
    },
    placeholder: {
        type: String,
        default: "可选, 自定义权限"
    },
    // 判断是否需要默认值
    defaultValue: {
        type: Boolean,
        default: true
    }
})
// let inputData = ref()
const emits = defineEmits(['update:data'])
const input = (value) => {
    emits('update:data', value)
}
const inputChanged = (newValue)=>{
    console.log("inputData.newValue:",newValue)
    // 是0开头indexOf的返回值是0，否则是-1
    // 0777 --> 511 abc
    if (newValue.indexOf(0) == 0) {
        newValue = parseInt(newValue, 8)
        console.log("八进制转换结果:",newValue)
    }
    if (newValue > 511) {
        newValue = 511
    }
    emits('update:data', Number(newValue)?Number(newValue):420)
}
onMounted(()=>{
    // console.log("props.data:", props.data)
    // if (props.data === '' || props.data == null && props.defaultValue) {
    //     inputData.value = "25%"
    // } else {
    //     inputData.value = props.data
    // }
})
</script>

<template>
  <el-input :model-value="data" @input="input" @change="inputChanged" :placeholder="props.placeholder" :style="{width: props.inputWidth}" title="输入八进制或者十进制,八进制自动转为十进制,取值范围:0-511"/>
</template>  

<style scoped>

</style>